<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>日常档案填写</title>

    <link rel="stylesheet" type="text/css" href="./bootstrap/css/bootstrap.min.css">
    <link href="./bootstrap/css/styles.css" rel="stylesheet">

</head>

<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#sidebar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="CustomerManage.html"><span>实验动物</span>档案管理</a>
            <ul class="user-menu">
                <li class="dropdown pull-right">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span
                            class="glyphicon glyphicon-user"></span> User <span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="http://www.cau.edu.cn"><span class="glyphicon glyphicon-user"></span> Profile</a>
                        </li>
                        <li><a href="#"><span class="glyphicon glyphicon-cog"></span> Settings</a></li>
                        <li><a href="login.jsp"><span class="glyphicon glyphicon-log-out"></span> Logout</a></li>
                    </ul>
                </li>
            </ul>
        </div>

    </div><!-- /.container-fluid -->
</nav>
<div id="sidebar-collapse" class="col-sm-3 col-lg-2 sidebar">
    <form role="search">
        <div class="form-group">
            <input type="text" class="form-control" placeholder="Search">
        </div>
    </form>
    <ul class="nav menu">
        <li class="parent ">
            <a href="#">
                <span class="glyphicon glyphicon-list"></span> 用户信息管理 <span data-toggle="collapse" href="#sub-item-1"
                                                                            class="icon pull-right"><em
                    class="glyphicon glyphicon-s glyphicon-plus"></em></span>
            </a>
            <ul class="children collapse" id="sub-item-1">
                <li>
                    <a class="" href="CustomerPersonalInformation.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 个人信息
                    </a>
                </li>
                <li>
                    <a class="" href="CustomerChangePassword.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 修改密码
                    </a>
                </li>
            </ul>
        </li>

        <li class="parent ">
            <a href="#">
                <span class="glyphicon glyphicon-list"></span> 档案处理 <span data-toggle="collapse" href="#sub-item-2"
                                                                          class="icon pull-right"><em
                    class="glyphicon glyphicon-s glyphicon-plus"></em></span>
            </a>
            <ul class="children collapse" id="sub-item-2">
                <li>
                    <a class="" href="CustomerCreateFile.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 档案填写
                    </a>
                </li>
                <li>
                    <a class="" href="CustomerQueryFile.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 档案查询
                    </a>
                </li>
                <li>
                    <a class="" href="CustomerUpdatefile.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 档案修改
                    </a>
                </li>
            </ul>
        </li>

        <li role="presentation" class="divider"></li>
        <li><a href="login.jsp"><span class="glyphicon glyphicon-user"></span>登录页面</a></li>
    </ul>
    <div class="attribution">Created by <a href="#">软工第9组</a></div>
</div><!--/.sidebar-->


<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2 main">
    <div class="row">
        <ol class="breadcrumb">
            <li><a href="CustomerManage.html"><span class="glyphicon glyphicon-home"></span></a></li>
            <li class="active">档案信息处理 > 日常档案填写</li>
        </ol>
    </div>


    <!-- 从这开始添加代码 -->

    <div class="row">
        <div class="col-lg-12">
            <!-- <iframe src="Home.html" width="100%" height="620px" ></iframe> -->
            <h3>
                <center><b>日常档案填写</b></center>
            </h3>


            <div class="row">
                <div class="col-md-4 col-md-offset-4">
                    <div class="login-panel panel panel-default" style="margin-top:20px;">
                        <div class="panel-heading">日常档案</div>
                        <div class="panel-body">
                            <form role="form">
                                <fieldset>
                                    <div class="form-group">
                                        档案编号：<input class="form-control" placeholder="档案编号" name="fileNumber"
                                                    type="text" value="">
                                        <!-- <span class="help-block" style="color:red;">   用户编号不能修改</span> -->
                                    </div>
                                    <div class="form-group">
                                        档案名称：<input class="form-control" placeholder="档案名称" name="fileTitle" type="text"
                                                    value="">
                                    </div>
                                    <div class="form-group">
                                        填写日期：<input class="form-control" placeholder="填写日期" name="fillingDate"
                                                    type="date" value="">
                                    </div>
                                    <div class="form-group">
                                        用户编号：<input class="form-control" placeholder="用户编号" name="userId" type="text"
                                                    value="">
                                    </div>
                                    <div class="form-group">
                                        动物编号：<input class="form-control" placeholder="动物编号" name="animalId" type="text"
                                                    value="">
                                    </div>

                                    <div class="form-group">
                                        日常动物信息备注：<input class="form-control" placeholder="日常动物信息备注" name="dailyDataTip"
                                                        type="text" value="">
                                    </div>
                                    <div class="form-group">
                                        上传PDF：<input class="form-control" placeholder="上传pdf" id="file" name="file"
                                                     type="file" value="">
                                    </div>
                                    <div class="form-group">
                                        <input class="form-control btn btn-primary submit" type="submit" value="添加"
                                               style="width:50%;margin-left:25%;">
                                    </div>
                                    <div class="form-group">
                                        <a href="CustomerManage.html" class="form-control btn btn-primary" id="btn-reg"
                                           style="width:50%;margin-left:25%;">返回</a>
                                    </div>
                                </fieldset>
                            </form>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
</div>

<script src="./bootstrap/js/jquery-3.1.0.min.js"></script>
<script src="./bootstrap/js/bootstrap.min.js"></script>

<script>

    $("#file").change(function () {
        var file = $("#file")[0].files[0];
        console.log(file.name)
        var formData = new FormData();
        formData.append("upload_file", file);
        $("#file").attr("file",file.name);
        $.ajax({
            url: "<%=basePath%>/UploadFile",
            type: "POST",
            data: formData,
            dataType: "json",
            processData: false,	// 使数据不做处理
            contentType: false,		// 不要设置Content-Type请求头
            success: function (res) {
                console.log(res)
                alert("操作成功");
            },
            error: function () {
                alert("操作失败")
            }
        });
    });

        $(".submit").on("click", function () {
            let fileNumber = $("input[name='fileNumber']").val();
            let fileTitle = $("input[name='fileTitle']").val();
            let fillingDate = $("input[name='fillingDate']").val();
            let userId = $("input[name='userId']").val();
            let animalId = $("input[name='animalId']").val();
            let dailyDataTip = $("input[name='dailyDataTip']").val();
            let file = $("#file").attr("file");
            let param = {
                fileNumber: fileNumber,
                fileTitle: fileTitle,
                fillingDate: fillingDate,
                userId: userId,
                animalId: animalId,
                dailyDataTip: dailyDataTip,
                file:file
            }
            $.ajax({
                url: './CreateDailyArchive',
                data: param,
                type: 'post',
                dataType: 'json',
                async: false,
                success: function (response) {
                    console.log(response)
                    alert("添加成功");
                },
                error: function () {
                    alert("添加失败");
                }
            });
        });


    // !function ($) {
    //     $(document).on("click","ul.nav li.parent > a > span.icon", function(){
    //         $(this).find('em:first').toggleClass("glyphicon-minus");
    //     });
    //     $(".sidebar span.icon").find('em:first').addClass("glyphicon-plus");
    // }(window.jQuery);
    /**
     $(window).on('resize', function () {
			  if ($(window).width() > 768) $('#sidebar-collapse').collapse('show')
			})
     $(window).on('resize', function () {
			  if ($(window).width() <= 767) $('#sidebar-collapse').collapse('hide')
			})
     */
</script>

</body>

</html>
